<template>
	<n-card title="待批阅班级">
		<el-table :data="tableData" style="width: 100%">
			<el-table-column prop="name" label="班级"></el-table-column>

			<el-table-column label="操作" width="180">
				<template #default="scope">
					<el-button
						type="success"
						size="small"
						@click="goToCheckExp(scope.row)"
						>开始批阅</el-button
					>
					<!-- <el-button type="warning" size="small">删除</el-button> -->
				</template>
			</el-table-column>
		</el-table>
	</n-card>
</template>
<script setup lang="ts">
//@ts-nocheck
import { getClass } from '../../api/request'
// 引入onMounted
import { onMounted, ref, reactive } from 'vue'
const router = useRouter()
const expLists = ref([
	{
		id: 1,
		name: '液体粘滞系数的测定',
	},
	{
		id: 2,
		name: '密立根液体表面张力系数的测定油滴实验',
	},
	{
		id: 3,
		name: '用牛顿环仪测量透镜的曲率半径',
	},
	{
		id: 4,
		name: '迈克尔逊干涉仪的调节与使用',
	},
])
const tableData = ref([])
const result = ref([])
onMounted(() => {
	const jwtToken = localStorage.getItem('jwtToken')
	getClass(jwtToken).then((res) => {
		console.log('获取到的班级', res)
		result.value = res.data.data
		result.value = result.value.map((item) => ({
			cid: item.cid,
			name: `${item.major}${item.classNum}班`,
			state: 0,
		}))
		console.log('处理后的result', result.value)
		tableData.value = result.value
		// console.log('tableData', tableData.value)
	})
})
const goToCheckExp = (scope) => {
	console.log('实验的id', scope)
	// localStorage.setItem('expId', scope.id)
	// localStorage.setItem('expName', scope.name)
	router.push({
		path: `/review-student/${scope.cid}`,
		query: { cid: scope.cid },
	})
}
</script>

<style lang="less" scoped>
.bottom-content {
	padding: 14px;
	text-align: center;
	.bottom {
		margin-top: 13px;
		line-height: 12px;
		display: flex;
		align-items: center;
		justify-content: center;
		.button {
			padding: 18px;
			min-height: auto;
		}
	}
}

.image {
	width: 100%;
	display: block;
}
</style>
